
*{
    margin: 0;
    padding: 0;}
ul,ol,li{list-style:none;}
b,strong{font-weight:normal;}
em,i{font-style:normal;}
a,u{text-decoration: none;}
img{border:0;display:block;}
input{outline:none;}
*{box-sizing:border-box;}
.center li.red{color: red}
header{ width:100%; height:auto; }
.top{ width:100%; height:30px; height:30px;background-color:#F2F2F2;}
.search{ width:100%; height:70px;padding-top: 15px}
nav{ width:100%; height:42px; background-color:#000;}
.banner{ width:100%; height:524px; overflow:hidden;}
.top ul,nav ul{ display:flex;}
.top a{color: #000;}
nav a{color: #fff;}
.center{ width:1000px; height:100%; margin:0 auto;display:flex;
    justify-content:space-between;align-items:center}
.top .center ul img{ float:left;}
.top .center ul li { margin-right:20px;}
.top .center ul li:last-child a{ background:url(../img/base_z.png) 0 0 no-repeat;}
nav ul li { margin-right:50px;}
nav ul li a.on{color:red}
nav ul .cart{display: block;
    width: 23px;
    height: 40px;
    background: url("../img/base_z.png") -1017px -219px no-repeat;}
nav .shop li {
    background:#eee;
    width: 280px;
    height: 100px;
    position: absolute;
    top: 50px;
    right: -173px;
    z-index: 999;
    overflow: hidden;
}
nav .shop li+li{
    margin-top: 110px;
}
nav .shop li img{
    float: left;
    margin: 10px;
    height: 80px;
}
nav .shop li h3{
   text-align: left;
    margin: 20px;
    font-size: 14px;
    font-weight: normal;

}
nav .shop li p{
    margin-right: 30px;
    color: #dd2828;
   text-align: right;

}
h1{ width:369px; height:36px; margin-left:170px;}
h1 a{ display:block;background:url("../img/logo.png") 100% 100% no-repeat; width:369px; height:36px;}
.auto{width: 1000px;
    margin: 0 auto;
    height: auto;
}
.location{
    margin-bottom: 20px;}
.location a{color: #cccccc}
.location a:last-child{color: #000}
.main{height:auto;width: 1000px;
    overflow: hidden;
    margin-top: 10px;
    border-bottom: 1px solid #ccc;
    position: relative;
}
.main .img{float: left;
    width:480px ;margin-right: 20px;
    position: relative;
    overflow: hidden;
    margin-bottom: 50px;
}
.img .big{ width: 480px;
    height: 640px;
    position: relative;}
.big ul {
    width: 3000%;
    height:640px;
    position: absolute;
}
.big ul li{
    width: 480px;
    height: 640px;
    float: left;
}
.area{
    width: 100px; height: 100px;
    background: rgba(200, 250, 200, 0.4); position: absolute;
    left: 0;
    top: 0;
    display: none;
}
.bigarea{
    width: 450px;
    height: 500px;
    border: 1px solid #ccc;
    position: absolute;
    left: 490px;
    top: 50px;
    overflow: hidden;
    display: none;
}
.bigimg {
    width: 1000px;
    height: 1500px;
    position: absolute;
}
.big #left{
    display: block;
    background: url(../img/left.png) 0 0 no-repeat;
    width: 23px;
    height: 42px;
    position: absolute;
    left: 10px;
    top:40%;
    z-index: 100;
}
.big #right{
    display: block;
    background: url(../img/next.png) 0 0 no-repeat;
    width: 23px;
    height: 42px;
    position: absolute;
    right: 10px;
    top:40%;
    z-index: 100;
}
.main .info{
    float: right;
    width:500px;}
.small{
    margin-left: 50px;margin-top: 10px}
.small img  {
    float: left;
    margin-right: 10px;
    width: 80px;
    height: 107px;}
.main .info p:nth-of-type(1){color: #929292;
    margin-top: 10px;}
.main .info h3{font-size: 28px;
    font-weight: bold;
    color: #dd2828;display: inline-block;margin-top: 10px;}
.main .info h4 {display: inline-block;
    float: right;
    margin-right: 50px;margin-top: 20px;}
.main .info del{color: #ccc;
    margin-left: 20px;margin-top: 10px;display: inline-block}
.main .info p:nth-of-type(2){
    width: 450px;
    height: 30px;
    background-color: #eee;
    text-align: center;
    line-height: 30px;font-size: 14px;margin-top: 20px;}
.main .info .gray{color: #929292}
.main .info p:nth-of-type(3){
    margin-top: 20px;}
.main .info p:nth-of-type(4){
    margin-top: 20px;}
.main .info p:nth-of-type(5){
    margin-top: 20px;}
.main .info span{display: inline-block;
    margin-top: 10px;
    width: 68px;
    height: 34px;
    line-height: 34px;
    text-align: center;
    font-size: 14px;
    font-weight: 500;
    color: #000;
    background: #eee;
    margin-right: 20px;
    user-select:none;
}

.info .time{margin-top: 30px}
.info .time h3{
    float: left;
    color:#000;
    font-size: 16px;
    margin-top: 0;
    margin-left: 72px;
}
.info .time h3 i{
    display: block;
    color: #ccc;
}
.info .time .container{
    float: right;
    margin-right: 40px;
}
.info .time .container div{display: inline-block}
.time .container div strong
{
    display: inline-block;
    float: left;
    width:30px;
    height:30px;
    line-height:30px;
    border:1px dashed #ccc;
    font-weight: bold;
    font-size: 22px;
    text-align: center;
    margin-right:5px;

}
.time .container div em{
    font-size: 16px;
    width:30px;
    height:30px;
    margin-right:5px;
    line-height:30px;
    display: inline-block;
    float: right;
    color: grey;
}
.main .info span.on{
    background-color: #000;color: #fff}
.main .info p:nth-of-type(6){
    margin-top: 20px;}

.main .info div span{    width: 34px;
    height: 34px;
    line-height: 34px;
    text-align: center;
    font-size: 24px;
    background: #eee;}
.main .info div #num{
    background-color: #fff;}

.main .info p:nth-of-type(8){
    margin-top: 20px;}
.main .info p:nth-of-type(8) img{
    display: inline-block;margin-right: 20px;
}
.main .info p:nth-of-type(8) a{
    float: right;
    color: #000;
    text-decoration: underline;
}
.main .info p:nth-of-type(8) a img{
    width: 540px;
    height: 135px;
    z-index: 99;
    position: absolute;
    float: right;
    right: -10px;
    display: none;
}
.main .info p:nth-of-type(8) a:hover img{
    display: block;
}


.main .info p:nth-of-type(9){
    margin-top: 30px;
}
.main .info p #join{
    width: 230px;
    height: 44px;
    text-align: center;
    line-height: 44px;
    font-size: 14px;
    background-color: #222;
    color: #fff;
    margin-right: 20px;
    border: none;
}
.main .info p #buy{
    width: 230px;
    height: 44px;
    text-align: center;
    line-height: 44px;
    font-size: 14px;
    background-color: #dd2828;
    color: #fff;
    border: none;
}
.size h2,.product h2{
    text-align: center;
    margin-top: 40px;
    font-size: 28px}
.size p,.product p{
    text-align: center;
    font-size: 18px;
    margin-bottom: 20px;
    line-height: 50px;
}
.size table {margin-bottom: 50px}
.size table thead tr td{
    width: 120px;
    font-size: 14px;
    color: #fff;
    background-color: #000;
    border-bottom: 1px solid #fff;
    height: 50px;
    text-align: center;
    vertical-align: middle;
}
.size table thead{
    float: left;
}
.size table tbody{
    float: right;
}
.size table tbody tr td{
    width: 288px;
    height: 50px;
    text-align: center;
    vertical-align: middle;
}
.size table tbody tr:nth-child(odd){
    background-color: #e7e7e7;
}
.product p:nth-of-type(2){
    margin-top: 10px;
    line-height: 20px;
    font-size: 14px;
    color: #a3a3a3;
    text-align: left;}
.product ul{width: 1000px;height: auto;
}
.product ul li{float: left;
    width: 480px;
    height: 647px;
    margin-right: 19px;
    overflow: hidden;}

.other{
    margin-top: -40px;
    margin-bottom: 20px;
}
footer{ width:100%;height: 235px;position: relative;
    margin: 0 auto;
    background-color: #f2f2f2;
    padding-top: 15px;
}
footer a{color:#000}
footer ul{ display:flex;}
footer ul:nth-of-type(1) li{
    width: 165px;
    height: 60px;
    border-right: 1px solid #777;
    text-align:center;
    margin:0 auto;
    margin-bottom:10px;
}
footer ul:nth-of-type(1) li:last-child{
    border-right:none;
}
footer ul:nth-of-type(2){
    display:flex;
    justify-content:center;
    margin-bottom:15px;
}
footer ul { padding-top:15px;font-size:14px}
footer ul:nth-of-type(2) li{
    margin-right:12px;
}
footer p{ text-align:center;margin-bottom:20px;font-size:14px}
footer img{ margin:0 auto;}
footer ul li a{display:flex;justify-content:center;align-items:center;flex-direction:column}
footer ul li a img { width:46px; height:32px; }
footer ul li a.a1 img{background:url("../img/base_z.png") -220px -150px no-repeat;}
footer ul li a.a2 img{background:url("../img/base_z.png") -602px -106px no-repeat;}
footer ul li a.a3 img{background:url("../img/base_z.png") -217px -385px no-repeat;}
footer ul li a.a4 img{background:url("../img/base_z.png") -485px 5px no-repeat;}
footer ul li a.a5 img{background:url("../img/base_z.png") -368px -350px no-repeat;}
footer ul li a.a6 img{background:url("../img/base_z.png") -370px -117px no-repeat;}
footer ul li a:hover{color:red}
footer ul li .a1:hover img{background:url("../img/base_z.png") -220px -268px no-repeat;}
footer ul li .a2:hover img{background:url("../img/base_z.png") -602px 5px no-repeat;}
footer ul li .a3:hover img{background:url("../img/base_z.png") -368px -232px no-repeat;}
footer ul li .a4:hover img{background:url("../img/base_z.png") -485px -108px no-repeat;}
footer ul li .a5:hover img{background:url("../img/base_z.png") -368px -463px no-repeat;}
footer ul li .a6:hover img{background:url("../img/base_z.png") -370px 0px no-repeat;}
